.range-scale {
    width: 256px;
    height: 48px;
    border-radius: 8px;
    padding: 7px 16px;
    display: flex;
    align-items: center;
    background-color: #fff;
    .range-content {
        display: flex;
        align-items: center;
        gap: 8px;
        .slider {
            --bg-width: 0px;
            --progress-h: 2px;
            width: 100px;
            height: var(--progress-h);
            position: relative;
            background-color: #E4E7ED;
            cursor: pointer;
            &::after {
                content: '';
                display: block;
                height: var(--progress-h);
                width: var(--bg-width);
                background-color: #262626;
            }
            .slider-thumb {
                position: absolute;
                top: 50%;
                transform: translate(-50%,-50%);
                width: 10px;
                height: 10px;
                box-sizing: border-box;
                border-radius: 9999px;
                border: 2px solid #262626;
                background-color: #fff;
                user-select: none;
            }
        }
    }
    .chore-gps {
        width: 32px;
        height: 30px;
        display: flex;
        justify-content: center;
        align-items: center;
        &:hover {
            background-color: #F0F2F5;
        }
    }
    .range-btn {
        width: 32px;
        height: 30px;
        display: flex;
        justify-content: center;
        align-items: center;
        &:hover {
            background-color: #F0F2F5;
        }
    }
    .cur-base {
        cursor: pointer;
    }
}